import { View, Image } from '@tarojs/components'
import { useLoad ,navigateTo} from '@tarojs/taro'
import style from './index.module.scss'
import classnames from 'classnames/bind'
import pageData from '../../config/pages.json'
import "taro-ui/dist/style/components/article.scss";
import ZImage from '@/components/ZImage'
const CBN = classnames.bind(style)

export default function Index() {
  const baseUrl = 'https://h5.zhqh.com.cn:6001/uploadfiles/plamhall/indeximages/'
  useLoad(() => {
    console.log('Page loaded.', pageData)
  })

  const linkToPage = (url:string)=>{
    navigateTo({
      url
    })
  }

  return (
    <View className={CBN('homepage')}>
      {
        pageData.map((item, index) => {
          const { title, list,type } = item
          return <View key={index} className={CBN({
            item:true,
          })}>
            <View className={CBN('item_title')}>{title}</View>
            <View className={CBN({
              item_list:true,
              [type]:true
            })}>
              {
                list.map((item, index) => {
                  const {url,cover,title} = item
                  return <View className={CBN('block')} key={index} onClick={()=>linkToPage(url)}>
                    <ZImage
                      className={CBN('block_logo')}
                      src={`${baseUrl}${cover}`}></ZImage>
                    <View className={CBN('block_name')}>{title}</View>
                  </View>
                })
              }
            </View>
          </View>
        })
      }
    </View>
  )
}
